var mapData = [
	{ name: "北京", value: 1516 }, { name: "上海", value: 311 },
	{ name: "天津", value: 177 }, { name: "重庆", value: 158 },
	{ name: "安徽", value: 245 }, { name: "福建", value: 110 },
	{ name: "甘肃", value: 86 }, { name: "广东", value: 414 },
	{ name: "广西", value: 95 }, { name: "贵州", value: 33 },
	{ name: "海南", value: 15 }, { name: "河北", value: 852 },
	{ name: "河南", value: 446 }, { name: "黑龙江", value: 70 },
	{ name: "湖北", value: 337 }, { name: "湖南", value: 218 },
	{ name: "吉林", value: 82 }, { name: "江苏", value: 506 },
	{ name: "江西", value: 151 }, { name: "辽宁", value: 192 },
	{ name: "内蒙古", value: 45 }, { name: "宁夏", value: 4 },
	{ name: "青海", value: 2 }, { name: "山东", value: 522 },
	{ name: "山西", value: 127 }, { name: "陕西", value: 152 },
	{ name: "四川", value: 282 }, { name: "西藏", value: 1 },
	{ name: "新疆", value: 5 }, { name: "云南", value: 83 },
	{ name: "浙江", value: 251 }, { name: "澳门", value: 0 },
	{ name: "中国台湾", value: 0 }, { name: "香港", value: 0 },
];
var sortedMapData = mapData.slice().sort(function(a, b) {
	return b.value - a.value;
}).slice(0, 5);	

var middle1 =echarts.init(document.getElementById("middle1"),'infographic');
var middle2 =echarts.init(document.getElementById("middle2"),'infographic');
var option1 = {
	title: {
		text: '各省二手书购买力分布图',
		x:'center'
	},
	toolbox: {
		feature: {
			saveAsImage: {}, 
			dataView: { readOnly: false }, 
			restore: {}, 
		}
	},
	legend: {
		show: false 
	},
	tooltip : {
		trigger: 'item'
	},
	visualMap: {
		splitList: [
			{start: 0, end: 250},{start: 250, end: 500},
			{start: 500, end: 750},{start: 750, end: 1000},
			{start: 1000, end: 1250},{start: 1250, end: 1500},
			{start: 1500, end: 1750},{start: 1750, end: 2000}
		],
	},
	series: [{
		name: '购买力',
		type: 'map',
		mapType: 'china', 
		roam: true,
		label: {
			normal: {
				show: false
			},
			emphasis: {
				show: false
			}
		},
		data:mapData
	}]
};

var option2 = {
	title: {
		text: '购买力最强的五个省份条形图',
		x: 'center'
	},
	toolbox: {
		feature: {
			saveAsImage: {}, 
			dataView: { readOnly: false }, 
			restore: {}, 
		}
	},
	tooltip: {
		trigger: 'axis',
		axisPointer: {
			type: 'shadow'
		}
	},
	xAxis: {
		type: 'category',
		data: sortedMapData.map(function(item) {
			return item.name;
		})
	},
	yAxis: {
		type: 'value'
	},
	series: [{
		name: '购买人数',
		type: 'bar',
		data: sortedMapData.map(function(item) {
			return item.value;
		})
	}],
};
middle1.setOption(option1);
middle2.setOption(option2);

middle1.on('click', function (params) {
    window.location.href = 'https://shop.kongfz.com/ranklist/?event=area&type=8000000000000000&provId=5000000000&cityId=0&currPage=1';
});
middle2.on('click', function (params) {
    window.location.href = 'https://shop.kongfz.com/ranklist/?event=area&type=8000000000000000&provId=5000000000&cityId=0&currPage=1';
});

